<template>
  <div class="container">
    <header>
      <van-nav-bar
        title="新增工程验收节点"
        left-arrow
        @click-left="$router.back()">
      </van-nav-bar>
    </header>
    <div class="wd-scroll-body2">
      <div class="wd-group">
        <div class="wd-group__title">形象进度确认</div>
        <div class="wd-group__body">
          <van-field
            label-width="120px"
            label="形象进度确认表">
            <input
              readonly="readonly"
              v-model="xxjdqrb"
              placeholder="选择文件"
              @click="$refs.xxjdqrbFile.click()"
              slot="input"
              type="text"
              class="van-field__control">
            <div class="wd-upload-file__control" slot="button">
              <van-icon @click="upFile(1)" name="upgrade"/>
              <van-icon @click="delFile(1)" name="close"/>
            </div>
          </van-field>
          <van-field
            label-width="120px"
            label="形象进度照片">
            <input
              readonly="readonly"
              v-model="xxjdzp"
              placeholder="选择文件"
              @click="$refs.xxjdzpFile.click()"
              slot="input"
              type="text"
              class="van-field__control">
            <div class="wd-upload-file__control" slot="button">
              <van-icon @click="upFile(2)" name="upgrade"/>
              <van-icon @click="delFile(2)" name="close"/>
            </div>
          </van-field>
        </div>
      </div>
      <div class="wd-group">
        <div class="wd-group__title">质量安全验收确认</div>
        <div class="wd-group__body">
          <van-field
            label-width="120px"
            label="质量验收确认表">
            <input
              readonly="readonly"
              v-model="zjysqrb"
              placeholder="选择文件"
              @click="$refs.zjysqrbFile.click()"
              slot="input"
              type="text"
              class="van-field__control">
            <div class="wd-upload-file__control" slot="button">
              <van-icon @click="upFile(3)" name="upgrade"/>
              <van-icon @click="delFile(3)" name="close"/>
            </div>
          </van-field>
        </div>
      </div>
      <div class="wd-group">
        <div class="wd-group__title">节点完成申报审批审查项</div>
        <div class="wd-group__body">
          <van-cell class="wd-cell-checkbox">
            <template slot="title">
              <span style="margin-right: 4px; vertical-align: middle">工程节点是否汇报完成</span>
              <i @click="nodeDetailshow(0)" style="font-size: 18px; color: #fa7d3c; vertical-align: middle" class="van-icon van-icon-info-o"></i>
            </template>
            <van-switch @click="sbspClick('nodeReport')" size="small" v-model="form.nodeReport == '1' || form.nodeReport == '_1'" />
          </van-cell>
          <div v-if="proNodeList.length > 0" v-show="proNodeListShow" class="wd-shenchaDetail">
            <van-cell v-for="item in proNodeList">
              <template slot="title">
                <span>{{item.JIEDIANMINCHENG}}</span>
              </template>
              <span>{{item.percentComplete | proNodeListPercent}}</span>
            </van-cell>
          </div>
          <van-cell class="wd-cell-checkbox">
            <template slot="title">
              <span style="margin-right: 4px; vertical-align: middle">质量管理整改完成率是否100%</span>
              <i @click="nodeDetailshow(1)" style="font-size: 18px; color: #fa7d3c; vertical-align: middle" class="van-icon van-icon-info-o"></i>
            </template>
            <van-switch @click="sbspClick('qualityReport')" size="small" v-model="form.qualityReport == '1' || form.qualityReport == '_1'" />
          </van-cell>
          <div v-if="qualityList.length > 0" v-show="qualityListShow" class="wd-shenchaDetail">
            <van-cell v-for="item in qualityList">
              <template slot="title">
                <span>{{item.POINT}}</span>
              </template>
              <span>{{item.STATE}}</span>
            </van-cell>
          </div>
          <van-cell class="wd-cell-checkbox">
            <template slot="title">
              <span style="margin-right: 4px; vertical-align: middle">安全管理整改完成率是否100%</span>
              <i @click="nodeDetailshow(2)" style="font-size: 18px; color: #fa7d3c; vertical-align: middle" class="van-icon van-icon-info-o"></i>
            </template>
            <van-switch @click="sbspClick('securityReport')" size="small" v-model="form.securityReport == '1' || form.securityReport == '_1'" />
          </van-cell>
          <div v-if="securityList.length > 0" v-show="securityListShow" class="wd-shenchaDetail">
            <van-cell v-for="item in securityList">
              <template slot="title">
                <span>{{item.POINT}}</span>
              </template>
              <span>{{item.STATE}}</span>
            </van-cell>
          </div>
          <van-cell v-for="item in nodeWcList" class="wd-cell-checkbox" :title="item.itemContent">
            <van-switch @click="updateItem(item)" size="small" v-model="item.status == '1'" />
          </van-cell>
        </div>
      </div>
    </div>
    <van-row style="padding: 10px 0 20px 0">
      <van-col span="18" offset="3">
        <van-button :loading="qrysLoading" @click="qrysClick" :disabled="cYsan" round block type="info">确认验收</van-button>
      </van-col>
    </van-row>
    <input ref="xxjdqrbFile" @change="xxjdqrbChange" class="wd-input-file" type="file">
    <input ref="xxjdzpFile" @change="xxjdzpChange"  class="wd-input-file" type="file">
    <input ref="zjysqrbFile" @change="zjysqrbChange"  class="wd-input-file" type="file">
    <van-overlay :show="updateting">
      <div style="display: flex; align-items: center; justify-content: center; height: 100%;">
        <van-loading type="spinner" />
      </div>
    </van-overlay>
  </div>
</template>

<script>
  import moment from 'moment'
  import {
    apiGetDetail,
    apiConfirmYS,
    apiGetFileInfo,
    apiUpdate,
    apiGetUploadCode,
    apiUploadBase,
    apiSetItems
  } from '@/api/'
  const userNo = localStorage.getItem('userID')
  const addedID = localStorage.getItem('addedID')
  export default {
    data() {
      return {
        updateting: false,
        xxjdqrb: '',
        xxjdqrbFile: null,
        xxjdzp: '',
        xxjdzpFile: null,
        zjysqrb: '',
        zjysqrbFile: null,
        subData: {},
        nodeWcList: [],
        proNodeList: [],
        proNodeListShow: false,
        qualityList: [],
        qualityListShow: false,
        securityList: [],
        securityListShow: false,
        form: {
          figureTable: '',
          figurePhoto: '',
          reviewTable: '',
          nodeReport: '0',
          qualityReport: '0',
          securityReport: '0'
        },
        qrysLoading: false
      }
    },
    created() {
      const vm = this
      vm.updateting = true
      apiGetDetail(userNo, addedID).then(res => {
        const
          form = vm.form,
          data = res.data

        if (res.code == 2000) {
          for (let p in form) form[p] = res.data[p]

          if (data.reviewDate)
            data.reviewDate = moment(data.reviewDate.time).format('YYYY-MM-DD')

          vm.nodeWcList = data.itemList
          vm.proNodeList = data.proNodeList
          vm.qualityList = data.qualityList
          vm.securityList = data.securityList

          delete data.proNodeList
          delete data.itemList
          delete data.qualityList
          delete data.securityList

          vm.subData = data

          vm.getFilePath('figureTable')
          vm.getFilePath('figurePhoto')
          vm.getFilePath('reviewTable')
        }
        vm.updateting = false
      })
    },
    computed: {
      cYsan() {
        return (
          (this.form.nodeReport !== '1' && this.form.nodeReport !== '_1') ||
          (this.form.qualityReport !== '1' && this.form.qualityReport !== '_1') ||
          (this.form.securityReport !== '1' && this.form.securityReport !== '_1') ||
          this.form.xxjdqrb ||
          this.form.xxjdzp ||
          this.form.zjysqrb ||
          this.checkdata()
        )
      }
    },
    filters: {
      proNodeListPercent(v) {
        if (v >= 100) {
          return '是'
        } else {
          return '否'
        }
      }
    },
    methods: {
      nodeDetailshow(type) {
        const vm = this
        if (type == 0) {
          if (vm.proNodeList.length < 1) vm.$toast('当前项没有数据!')
          vm.proNodeListShow = !vm.proNodeListShow
        }
        if (type == 1) {
          if (vm.qualityList.length < 1) vm.$toast('当前项没有数据!')
          vm.qualityListShow = !vm.qualityListShow
        }
        if (type == 2) {
          if (vm.securityList.length < 1) vm.$toast('当前项没有数据!')
          vm.securityListShow = !vm.securityListShow
        }
      },
      checkdata() {
        var itemTrue = false
        this.nodeWcList.forEach(item => {
          if (item.status !== '1') itemTrue = true
        })
        return itemTrue
      },
      // 确认验收
      qrysClick() {
        if (!this.form.figureTable || !this.form.reviewTable || !this.form.figurePhoto) {
          this.$toast('信息填写不完整！')
          return
        }
        this.qrysLoading = true
        apiConfirmYS(userNo, addedID).then(res => {
          if (res.code == 2000) {
            this.$router.push({
              path: '/engNodeAcpt/shenghe',
              query: {
                url: res.url.substr(9)
              }
            })
          } else {
            this.$toast('验收失败!')
          }
          this.qrysLoading = false
        })
      },
      updateItem(item) {
        var vm = this

        // function getItem(name) {
        //   var item = null
        //   vm.nodeWcList.forEach(node => {
        //     if (node.itemContent == name) {
        //       item = node
        //     }
        //   })
        //   return item
        // }

        // switch(name) {
        //   case 'jypjfx':
        //     form2.jypjfx = form2.jypjfx == '1' ? '0' : '1'
        //     let node = getItem('检验批（隐蔽）及分项资料是否移交总包')
        //     node.status = form2.jypjfx
        //     sData = node
        //   break
        //   case 'dfbdwcf':
        //     form2.dfbdwcf = form2.dfbdwcf == '1' ? '0' : '1'
        //     let node2 = getItem('对分包单位的的罚款是否已执行落地')
        //     node2.status = form2.dfbdwcf
        //     sData = node2
        //   break
        //   case 'jgcclfy':
        //     form2.jgcclfy = form2.jgcclfy == '1' ? '0' : '1'
        //     let node3 = getItem('甲供材超量费用是否已扣减')
        //     node3.status = form2.jgcclfy
        //     sData = node3
        //   break
        // }

        item.status = item.status == '1' ? '0' : '1'

        vm.updateting = true

        apiSetItems(userNo, item).then(res => {
          if (res.code == 2000) {
            vm.$toast('更新成功！')
          }
          vm.updateting = false
        })
      },
      delFile(index) {
        const vm = this
        if (index == 1) {
          if (!vm.form.figureTable) {
            vm.$toast('没有上传过文件！')
            return
          }
          vm.xxjdqrbFile = null
          vm.xxjdqrb = ''
          vm.form.figureTable = ''
          vm.subData.figureTable = ''
        }
        if (index == 2) {
          if (!vm.form.figurePhoto) {
            vm.$toast('没有上传过文件！')
            return
          }
          vm.xxjdzp = ''
          vm.xxjdzpFile = null
          vm.form.figurePhoto = ''
          vm.subData.figurePhoto = ''
        }
        if (index == 3) {
          if (!vm.form.reviewTable) {
            vm.$toast('没有上传过文件！')
            return
          }
          vm.zjysqrb = ''
          vm.zjysqrbFile = null
          vm.form.reviewTable = ''
          vm.subData.reviewTable = ''
        }
        vm.updateting = true
        vm.submit()
      },
      getFilePath(name) {
        const
          vm = this,
          code = vm.form[name]

        if (!code) return

        apiGetFileInfo(userNo, code).then(res => {
          if (res.code == 2000) {
            if (name == 'figureTable') {
              vm.xxjdqrb = res.data.attachment.name
            }
            if (name == 'figurePhoto') {
              vm.xxjdzp = res.data.attachment.name
            }
            if (name == 'reviewTable') {
              vm.zjysqrb = res.data.attachment.name
            }
          }
        })
      },
      sbspClick(name) {
        const
          vm = this,
          form = vm.form,
          subData = vm.subData

        if (name == 'nodeReport') {
          form.nodeReport = (form.nodeReport == '1' || form.nodeReport == '_1') ? form.nodeReport = '_0' : form.nodeReport = '_1'
          subData.nodeReport = form.nodeReport
        }
        if (name == 'qualityReport') {
          form.qualityReport = (form.qualityReport == '1' || form.qualityReport == '_1') ? form.qualityReport = '_0' : form.qualityReport = '_1'
          subData.qualityReport = form.qualityReport
        }
        if (name == 'securityReport') {
          form.securityReport = (form.securityReport == '1' || form.securityReport == '_1') ? form.securityReport = '_0' : form.securityReport = '_1'
          subData.securityReport = form.securityReport
        }

        vm.updateting = true
        vm.submit()
      },
      xxjdqrbChange(ev) {
        const file = ev.target.files[0]
        this.xxjdqrb = file.name
        this.xxjdqrbFile = file
      },
      xxjdzpChange(ev) {
        const file = ev.target.files[0]
        this.xxjdzp = file.name
        this.xxjdzpFile = file
      },
      zjysqrbChange(ev) {
        const file = ev.target.files[0]
        this.zjysqrb = file.name
        this.zjysqrbFile = file
      },
      submit() {
        apiUpdate(userNo, this.subData).then(res => {
          if (res.code == 2000) {
            this.$toast('更新成功！')
            this.getFilePath('figureTable')
            this.getFilePath('figurePhoto')
            this.getFilePath('reviewTable')
          } else {
            this.$toast('更新失败！')
          }
          this.updateting = false
        })
      },
      upFile(type) {
        var file = null

        const
          vm = this,
          reader = new FileReader()

        if (type == 1) file = vm.xxjdqrbFile
        if (type == 2) file = vm.xxjdzpFile
        if (type == 3) file = vm.zjysqrbFile

        if (!file) {
          vm.$toast('请选择文件！')
          return
        }

        const fileName = file.name

        vm.updateting = true

        reader.onload = function(ev) {
          apiGetUploadCode(userNo).then(res => {
            if (res.code == 2000) {
              const code = res.data
              apiUploadBase(userNo, code, ev.target.result, fileName).then(res => {
                if (res.success) {
                  if (type == 1) {
                    vm.form.figureTable = code
                    vm.subData.figureTable = code
                  }
                  if (type == 2) {
                    vm.form.figurePhoto = code
                    vm.subData.figurePhoto = code
                  }
                  if (type == 3) {
                    vm.form.reviewTable = code
                    vm.subData.reviewTable = code
                  }
                  vm.submit()
                } else {
                  vm.updateting = false
                  vm.$toast('文件上传失败！')
                }
              })
            } else {
              vm.updateting = false
              vm.$toast('获取code错误！')
            }
          })
        }

        reader.readAsDataURL(file)
      }
    }
  }
</script>